﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>${content.name!} - ${site.name!}</title>
    <!-- Custom Main StyleSheet CSS -->
    <link href="/${res}/style.css" rel="stylesheet">
    <!-- Color CSS -->
    <link href="/${res}/css/color.css" rel="stylesheet">
    <!-- Responsive CSS -->
    <link href="/${res}/css/responsive.css" rel="stylesheet">
    <link rel="stylesheet" href="//g.alicdn.com/de/prismplayer/2.5.0/skins/default/aliplayer-min.css"/>
    <script src="${resSys}/jquery.js" type="text/javascript"></script>
    <script src="${resSys}/front.js" type="text/javascript"></script>
    <script type="text/javascript" src="//g.alicdn.com/de/prismplayer/2.5.0/aliplayer-min.js"></script>
    <script type="text/javascript">
        $().ready(function () {
            //Cms.checkPerm("${base}", "${content.id}");
            Cms.collectCsi("${base}","collectCsiDiv","collect_csi","${content.id}");

            $("#videoPlay").click(function () {
                var userId_ = $("#userId_").val();
                if(!userId_){
                    window.location.href="${base}/wxauth.jspx?id=${content.id}";
                }else{
                    $.ajax({
                        url: "${base}/playVideo.jspx",
                        type: "POST",
                        dataType:"json",
                        data: {id : '${content.id}'},
                        success: function (data) {
                            if(data.flag){
                                $("#titleImg").hide();
                                $("#videoPlay").attr("disabled", true);
                                var player = new Aliplayer({
                                    id: 'J_prismPlayer',
                                    width: '100%',
                                    autoplay: true,
                                    showBarTime: '5000',
                                    fullTitle: '测试页面',
                                    //播放方式二：点播用户推荐
                                    vid: data.vid,
                                    playauth: data.playauth,
                                    cover: data.cover
                                }, function (player) {
                                    console.log('播放器创建好了。')
                                });
                            }else{
                                window.location.href = data.rediretUrl;
                            }
                        }
                    });
                }
            });
        });
    </script>
</head>

<body>

<!--gt Wrapper Start-->
<div class="gt_wrapper">

    <!--Header Wrap Start-->
    [#include "../include/nav.html"/]
    <!--Header Wrap End-->

    <!--Sub Banner Wrap Start -->
    <div class="gt_sub_banner_bg default_width">
        <div class="container">
            <div class="gt_sub_banner_hdg  default_width">
                <h2>${channel.name!}</h2>
            </div>
        </div>
    </div>
    <!--Sub Banner Wrap End -->
    [#include "../include/location.html"/]

    <!--Content Wrap Start-->
    <div class="gt_main_content_wrap">
        <!--Shop Wrap Start-->
        <div class="gt_shop_detail_bg gt_courses_bg">
            <div class="container">
                <div class="gt_product_detail_border_wrap">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="gt_shop_slider_outer_wrap">
                                <div class="shop_detaild_slider">
                                    <div id="shop_detaild_slider">
                                        <ul class="slides">
                                            <li>
                                                <img id="titleImg" src="${content.typeImg!content.titleImg!}" alt=""/>
                                                <div id="J_prismPlayer"></div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="gt_shop_detail_banner">
                                <h4>${content.title}</h4>
                                <ul class="gt_event_meta">
                                    <li><i class="fa fa-user"></i>${content.author!'正心正举'}</li>
                                    <li><i class="fa fa-calendar"></i>${(content.releaseDate?string('yyyy-MM-dd HH:mm:ss'))!}</li>
                                    <li><i class="fa fa-play"></i><span id="views">${content.views!}</span></li>
                                </ul>
                                <div class="gt_product_detail_des">
                                    <h6>视频简介</h6>
                                    <p>[@text_cut s=content.description! len='100' append='...'/]</p>
                                </div>
                                <div class="gt_product_left_wrap">
                                    <h6>这里主要写一些关于视频的一些废话，自己改，在zxzj/content/video.html里填写</h6>
                                    <span>费用:</span>
                                    <div id="incdec">
                                        <input type="text" value="${content.chargeAmount!}" readonly/>&nbsp;&nbsp;元
                                        [#if user??]<input type="hidden" id="userId_" value="${user.id!}"/>[/#if]
                                        [#if vid??]<input type="hidden" id="" value="${vid}"/>[/#if]
                                    </div>
                                </div>
                                <div class="gt_product_button_wrap">
                                    <input type="hidden" id="contentId" value="${content.id}">
                                    <button id="videoPlay" href="javascript:void(0)">播放</button>
                                    [#if user??]
                                    <button id="collectCsiDiv">收藏</button>[/#if]
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!--Product Tab Des Wrap Start-->
                <div class="gt_product_detail_border_wrap" style="margin: 50px 0px 0px;padding: 0px 0px 0px;border-bottom: 0px;">
                    <div class="gt_shop_tab_outer_wrap">
                        <div class="gt_shop_tab_link">
                            <ul id="tabs" data-tabs="tabs">
                                <li id="tab1" class="active"><a data-toggle="tab" href="#product_detail">视频简介</a></li>
                                <li id="tab2"><a data-toggle="tab" href="#sepecfication">相关视频</a></li>
                                <li id="tab3"><a data-toggle="tab" href="#customer_review">评论</a></li>
                            </ul>
                        </div>
                        <div id="my-tab-content" class="tab-content">
                            <div class="tab-pane active" id="product_detail">
                                <div class="gt_shop_tab_des">
                                    ${txt!}
                                </div>
                            </div>

                            <div class="tab-pane" id="sepecfication">
                                <div class="gt_shop_tab_des">
                                </div>
                            </div>

                            <div class="tab-pane" id="customer_review">
                                <div class="gt_shop_tab_des">
                                    [#if channel.commentControl!=2]
                                    [#include "inc_comment_list.html"/]
                                    [#include "inc_comment_input.html"/]
                                    [/#if]
                                </div>
                            </div>
                        </div>
                    </div>
                </div>




                <!--Product Tab Des Wrap End-->
                [@cms_content_list count='6' orderBy='4' titLen='10' channelId=channel.id channelOption='1']
                <div class="gt_courses_bg" id="video_reference">
                    <div class="container">
                        <!--Heading Wrap Start-->
                        <div class="gt_hdg_1 default_width" style="margin-top: 35px;">
                            <h3>相关视频</h3>
                            <p>视频的一些描述，都是废话，自己编写</p>
                            <span class="gt_hdg_left"></span>
                            <i class="icon-school"></i>
                            <span class="gt_hdg_right"></span>
                        </div>

                        <div class="gt_courses_slider" id="gt_courses_slider">
                            [#list tag_list as a]
                            <div class="item">
                                <div class="gt_courses_wrap default_width">
                                    <figure>
                                        <img src="${a.titleImg!a.typeImg!}" alt="" style="">
                                        <figcaption class="gt_course_img_des">
                                            <div class="gt_course_des_holder">
                                                <div class="gt_course_author">
                                                    <img src="/${res}/extra-images/course-author.png" alt="">
                                                    <a href="#"><i class="fa fa-user"></i>${content.author!'本站编辑'}</a>
                                                </div>
                                                <ul class="gt_rating_star">
                                                    <li>
                                                        <a href="#"><i class="fa fa-star"></i></a>
                                                        <a href="#"><i class="fa fa-star"></i></a>
                                                        <a href="#"><i class="fa fa-star"></i></a>
                                                        <a href="#"><i class="fa fa-star"></i></a>
                                                        <a href="#"><i class="fa fa-star"></i></a>
                                                    </li>
                                                </ul>
                                            </div>
                                            <div class="gt_course_cat gt_bg_4">New</div>
                                        </figcaption>
                                    </figure>
                                    <div class="gt_course_des default_width">
                                        <h5><a href="${a.url}">[@text_cut s=a.title len=titLen /]</a></h5>
                                        <span>${(a.date?string('yyyy-MM-dd'))!}</span>
                                        <p>[@text_cut s=a.desc len='30' append=append/]}</p>
                                    </div>
                                    <div class="gt_course_bottom default_width">
                                        <h5 style="font-size:14px;paddinr-left:20px">点击量：<span>${a.views}</span></h5>
                                    </div>
                                </div>
                            </div>
                            [/#list]
                        </div>
                    </div>
                </div>
                [/@cms_content_list]




            </div>
            </section>
            <!--Shop Wrap End-->
        </div>
        <!--Content Wrap End-->

        <!--Footer Wrap Start-->
        [#include "../include/footer.html"/]
        <!--Back to Top Wrap Start-->

    </div>
</div>

<!-- Flicker Widget Wrap Start -->

<!-- Flicker Widget Wrap End -->
    <script src="/${res}/js/bootstrap.min.js"></script>
    <!--Owl Carousel JavaScript-->
    <script src="/${res}/js/owl.carousel.js"></script>
    <!--Filter able JavaScript-->
    <script src="/${res}/js/custom.js"></script>

    <!--Custom JavaScript-->

    <script type="text/javascript">
        $(function () {
            $("#video_reference").css("display","none");
            $("#tab1").click(function(){
                $("#video_reference").css("display","none");
            });
            $("#tab2").click(function(){
                $("#video_reference").css("display","");
            });
            $("#tab3").click(function(){
                $("#video_reference").css("display","none");
            });
        });
    </script>

</body>
</html>
